<template>
  <div>
    <div class="banner">
      <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
        <van-swipe-item v-for="(v, i) in img" :key="i"
          ><img :src="v.require" alt="" 
        /></van-swipe-item>
      </van-swipe>
    </div>

    
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      n: 0,
      img: [
        { require: "img/banner1.jpeg" },
        { require: "img/banner2.jpeg" },
        { require: "img/banner3.jpeg" },
        { require: "img/banner4.jpeg" },
        { require: "img/banner5.png" },
      ],
    };
  },
  
};
</script>

<style scoped>
.banner {
  width: 100%;
  height: 1.56rem;
}
.my-swipe .van-swipe-item {
  color: #fff;
  font-size: 20px;
  text-align: center;
}
.banner img {
  width: 100%;
  margin: 0;
  padding: 0;
}
</style>